.detail-box {
    width: 980px;
    margin: 0px auto;
    display: flex;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
}

.left-part {
    float: left;
    width: 710px;
    padding: 47px 30px 40px 39px;
    /* border: 1px #e1e1e1 solid; */
}

.right-part {
    float: right;
}

.music-img {
    padding: 3px;
    border: 1px #d5d5d5 solid;
    width: 200px;
    height: 200px;
}

.music-img>img {
    width: 200px;
    height: 200px;
    display: block;
}

.music-info {
    width: 410px;
    text-align: left;
    margin-left: 25px;
}

.music-description {
    display: flex;
}

.music-tag {
    margin-right: 10px;
    position: relative;
}

.special-tag {
    position: absolute;
    top: 0px;
    right: 2px;
    transform: scale(0.7);
    display: none;
    color: #fff;
}

.author-info {
    display: flex;
    align-items: center;
}

.author-nickname {
    margin-left: 10px;
}

.author-nickname a {
    color: #0c73c2;
    font-size: 12px;
}

.author-nickname a:hover {
    text-decoration: underline;
}

.create-time {
    color: #999;
    font-size: 12px;
    margin-left: 15px;
}

.auth-tag {
    width: 12px;
    height: 12px;
    margin-left: 3px;
}

.hide-auth-tag {
    display: none;
}

.decription-contents {
    font-size: 20px;
    line-height: 24px;
}

.author-avatar>img {
    width: 40px;
    height: 40px;
}

.play-info {
    display: flex;
    align-items: center;
    margin: 10px 0px;
}

.play-control {
    color: #fff;
    background-image: linear-gradient(180deg, #4da1e0, #2475c3);
    border-radius: 4px;
    display: flex;
}

.play-control>div {
    padding: 5px;
}

.play-control .icon-play {
    font-size: 12px !important;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    border-right: 1px #286199 solid;
}

.play-control>div:hover {
    background-color: #57a1e6;
}

.play-detail-info {
    display: flex;
}

.play-detail-info>div {
    padding: 5px;
    font-size: 12px !important;
    background-color: #f1f1f1;
    border: 1px #c4c4c4 solid;
    box-sizing: border-box;
    border-radius: 4px;
    margin-left: 5px;
    color: #000;
}

.play-detail-info>div:hover {
    background-color: #fff;
    cursor: pointer;
}

.tag-box {
    color: #666666;
    margin: 10px 0px;
    font-size: 12px;
    display: flex;
    align-items: center;
}

.tag-box span {
    border-radius: 10px;
    color: #777777;
    background-color: #f1f1f1;
    padding: 2px 10px;
    border: 1px #d1d1d1 solid;
    margin-right: 5px;
}

.tag-box span:hover {
    background-color: #fff;
    cursor: pointer;
}

.discription {
    color: #666666;
    margin: 10px 0px;
    font-size: 12px;
    display: flex;
    line-height: 20px;
}

.discription>div:first-child span {
    width: 36px;
    display: block;
}

.quick-bar {
    position: fixed;
    right: 60px;
    bottom: 100px;
    border: 1px #dadada solid;
    background-color: #f4f4f4;
    color: #6e6f6e;
    font-size: 10px;
    transform: scale(0.9);
    padding: 5px 10px;
    border-radius: 4px;
    display: none;
}

.quick-bar:hover {
    cursor: pointer;
    background-color: #e6e3e3;
}

.show-bar {
    display: block;
}